<link rel="stylesheet" type="text/css" href="assets/plugins/H-ui_v3.1.1/lib/icheck/icheck.css"/>
<p class="com-title">
	委托安通
</p>
<form class="site-selection-form form form-horizontal" id="siteSelectForm">
	<div class="Huialert Huialert-danger"><i class="icon-remove"></i>说明:目前该服务仅针对杭州、上海、湖州等地区开通</div>
	<div class="row cl">
		<div class="formControls per75">
			<div class="formControls per50 error-parent simulation-btn">
				<div class="radio-box">
					<input type="radio" id="radio-01" name="type">
					<label for="radio-01">
						<button class="btn btn-primary-outline">厂房<i class="Hui-iconfont Hui-iconfont-selected"></i></button>
					</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="radio-02" name="type">
					<label for="radio-02">
						<button class="btn btn-primary-outline">仓库<i class="Hui-iconfont Hui-iconfont-selected"></i></button>
					</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="radio-03" name="type">
					<label for="radio-03">
						<button class="btn btn-primary-outline">土地<i class="Hui-iconfont Hui-iconfont-selected"></i></button>
					</label>
				</div>
				<div class="radio-box">
					<input type="radio" id="radio-04" name="type">
					<label for="radio-04">
						<button class="btn btn-primary-outline">园区<i class="Hui-iconfont Hui-iconfont-selected"></i></button>
					</label>
				</div>
			</div>
		</div>
	</div>
	<div class="row cl">
		<div class="formControls per40 error-parent">
			<div class="radio-box">
				<input type="radio" id="radio-11" name="intentions">
				<label for="radio-11">求租</label>
			</div>
			<div class="radio-box">
				<input type="radio" id="radio-12" name="intentions">
				<label for="radio-12">求购</label>
			</div>
			<div class="radio-box">
				<input type="radio" id="radio-13" name="intentions">
				<label for="radio-13">出租</label>
			</div>
			<div class="radio-box">
				<input type="radio" id="radio-13" name="intentions">
				<label for="radio-13">出售</label>
			</div>
		</div>
	</div>
	<div class="row cl">
		<div class="formControls per50 error-parent error-parent">
			<span class="select-box f-l per30 mr-10">
				<select class="select" name="province">
				    <option value="" selected>省</option>
				    <option value="1">1</option>
				    <option value="2">2</option>
				    <option value="3">3</option>
				</select>
			</span>
			<span class="select-box f-l per30 mr-10 error-parent">
				<select class="select" name="city">
				    <option value="" selected>市</option>
				    <option value="1">11</option>
				    <option value="2">12</option>
				    <option value="3">13</option>
				</select>
			</span>
			<span class="select-box f-l per30 error-parent">
				<select class="select" name="area">
				    <option value="" selected>区</option>
				    <option value="1">111</option>
				    <option value="2">112</option>
				    <option value="3">113</option>
				</select>
			</span>
		</div>
	</div>
	
	<div class="row cl">
		<div class="formControls per75">
			<span class="f-l per30 error-parent">
				<input type="text" name="user" placeholder="联系人" class="input-text size-M">
			</span>
		</div>
	</div>
	
	<div class="row cl">
		<div class="formControls per75">
			<span class="f-l per30 error-parent">
				<input type="text" name="phone" placeholder="联系电话" class="input-text size-M">
			</span>
		</div>
	</div>
	
	<div class="row cl">
		<div class="formControls per75">
			<textarea class="textarea" placeholder="需求详情"></textarea>
		</div>
	</div>
	
	<div class="row cl">
		<div class="formControls per75">
			<button type="submit" class="btn btn-primary radius">提交委托</button>
			<a class="c-green"  onClick="chooseAntongReason()">为什么要委托安通?</a>
		</div>
	</div>
</form>

<table class="table table-border table-bordered table-hover table-striped mt-30">
	<thead class="text-c">
    	<tr>
    		<th>类型</th>
    		<th width="40%">需求详情</th>
    		<th>联系人</th>
    		<th>联系电话</th>
    	</tr>
  	</thead>
  	<tbody>
		<tr class="text-c">
			<td>厂房[求购]</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
		<tr class="text-c">
			<td>厂房[求租]</td>
			<td></td>
			<td></td>
			<td></td>
		</tr>
  	</tbody>
</table>


<div id="chooseAntongReason" class="modal fade" tabindex="-1" role="dialog">
	<div class="modal-dialog">
		<div class="modal-content radius">
			<div class="modal-header">
				<h3 class="modal-title">为什么要委托安通?</h3>
				<a class="close" data-dismiss="modal" href="javascript:void();">×</a>
			</div>
			<div class="modal-body">
				<p>为什么要委托安通内容为什么要委托安通内容为什么要委托安通内容为什么要委托安通内容…</p>
			</div>
			<div class="modal-footer">
				<button class="btn btn-primary">已经了解</button>
				<button class="btn" data-dismiss="modal">关闭</button>
			</div>
		</div>
	</div>
</div>


<script type="text/javascript" src="assets/plugins/H-ui_v3.1.1/lib/icheck/jquery.icheck.min.js"></script>
<script type="text/javascript" src="assets/plugins/H-ui_v3.1.1/lib/jquery.validation/jquery.validate.min.js"></script>
<script type="text/javascript" src="assets/plugins/H-ui_v3.1.1/lib/jquery.validation/additional-methods.min.js"></script>
<script type="text/javascript" src="assets/plugins/H-ui_v3.1.1/lib/jquery.validation/messages_zh.js"></script>
<script type="text/javascript">
	$(function(){
		$('.row input').iCheck({
			checkboxClass: 'icheckbox-blue',
			radioClass: 'iradio-blue',
			increaseArea: '20%'
		})
		
		//表单验证
		$("#siteSelectForm").validate({
			rules:{
				type:{
					required:true
				},
				intentions:{
					required:true
				},
				user:{
					required:true
				},
				phone:{
					required:true,
					number:true,
					minlength:3
				}
			},
			onkeyup:false,
			submitHandler:function(form){
				debugger
			},
			errorPlacement:function(error,element){
				error.appendTo(element.parents('.error-parent'));
			}
		});
	});
	
	function chooseAntongReason(){
		$("#chooseAntongReason").modal("show")
	}
</script>